<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
*{
    margin: 0px;
    padding: 0px;
    list-style: none;
}
.A{
    height: 497PX;
    background: url("imges/top.jpg") repeat-x;
}
.a1{
    width: 968px;
    height: 75px;
    margin: 0px auto;
}
h1 a img{
    width: 129.63px;
    height: 44px;
    float:left;
    margin: 14px 0px 0px;
}
.a1 ul{
    float: right;
 
    }
.a1 li{
    margin-top: 16px;
    margin-right: 7px;
    padding: 10px;
    float: left;

}
.a1 li a{
    font-size: 13px;
    color:aliceblue;
    text-decoration: none

}
.a1 ul li:hover{
                background:black;
                border-radius:80px;
}
.a2{
    width: 968px;
    height: 424px;
    margin: 0px auto;
}
.a3{
    margin-top: 45px;
    height: 424px;
    width: 400px;
}
.a3 h3{
    margin-bottom: 22px;
}
.a3 p{
    color: #979797;
    font-size: 16px;
}
.p1{
    margin-top: 10px;
    margin-bottom: 10px;
}
h3{
    font-size: 26px;
    font-weight: 400px;
    
}
.a3 a img{
    margin-top: 25px;
    margin-bottom: 18px;
}
.a3 li a{
    font-size: 14px;
    color: #609700;
    text-decoration: none;
}
.a4{
    margin-top: 5px;
    margin-bottom: 5px ;

}
.a3 ul li:hover{
    text-decoration:underline;
    color:#609700;


}
.img{
    float: right;
}
.B{
    height: 400px;
    width: 968px;
    margin:44px auto 22px auto;
}
.b1{
    width: 645px;
    height: 306px;
    float: left;
}
.ba{
    width: 215px;
    height: 215px;
    margin-top: 20px;
    float: left;
}
.ba p{
    font-size: 14px;
    color: #999;
    margin-top: 5px;
}
.ba h5{
    font-size: 14px;
    margin-top: 6px;
}
.ba ul li:hover{
    text-decoration:underline;
    color:#609700;
}
.ba ul a{
    font-size: 14px;
    color: #609700;
    text-decoration: none;
}
.ba ul li{
    margin-top: 5px;
}
.bb{
    width: 215px;
    height: 215px;
    margin-top: 20px;
    margin: 0px auto;
    margin-top: 20px;
    float: left;

}
.bb p{
    font-size: 14px;
    color: #999;
    margin-top: 5px;
    margin-left: 3px;
}
.bb h5{
    font-size: 14px;
    margin-top: 6px;
    margin-left: 3px;
}
.bb ul li:hover{
    text-decoration:underline;
    color:#609700;
}
.bb ul a{
    font-size: 14px;
    color: #609700;
    text-decoration: none;
}
.bb ul li{
    margin-top: 5px;
    margin-left: 3px;
}
.bc{
    width: 215px;
    height: 215px;
    margin-top: 20px;
    margin: 0px auto  ;
    float: right;
    margin-top: 20px;

}
.bc p{
    font-size: 14px;
    color: #999;
    margin-top: 5px;
    margin-left: 3px;
}
.bc h5{
    font-size: 14px;
    margin-top: 6px;
    margin-left: 3px;
}
.bc ul li:hover{
    text-decoration:underline;
    color:#609700;
}
.bc ul a{
    font-size: 14px;
    color: #609700;
    text-decoration: none;
}
.bc ul li{
    margin-top: 5px;
    margin-left: 3px;
}
.b2{
    height: 306px;
    width: 323px;
    float: right;
}
.b2 ul a{
    font-size: 13px;
    color: #609700;
    text-decoration: none;
    margin-left: 14px;
   
}
.b2 ul li:hover{
    text-decoration:underline;
    color:#609700;
}
.b2 ul li{
    margin-top: 5px;
    
}
.b2 img{
    margin-top: auto;
    margin-right: 10px;
    float: left;


}
.b2 h5{
    margin-top: auto ;
}
.li1{
    margin-bottom: 20px;
}
.C{
    height: 61px;
    width: 968px;
    border-top: #DBDBDB solid 1px;
    margin: auto;
}
.p5:hover{
    text-decoration:underline;
    color:#888888;
}
.p5{
    font-size: 10px;
    color: #888888;
    text-decoration: none;
}
.p5{
    margin: 5px 4px;
    float: left;
}
.p3{
    float: left;
    margin: 5px 4px;
    color: #888888;
    font-size: 10px;
}
.p2{ 
    margin: 30px 4px;
    color: #888888;
    font-size: 10px;
}
.p4{
    float: right;
    margin: 5px 4px;
    color: #888888;
    font-size: 10px;
    text-decoration: none;
}
.p4:hover{
    text-decoration:underline;
    color:#888888;
}
.p6{
    float: right;
    margin: 5px 4px;
    color: #888888;
    font-size: 10px;
}
.AA{
    width: 968px;
    height: 800px;
    margin: auto;
}
</style>
<body>

    <div class="A">
        <div class="a1">
            <h1>
                <a  href="">
                    <img src="imges/logo.png" alt="">
                </a>
             </h1>
            <ul>
                <li>
                    <a href="">
                        首页
                    </a>
                </li>
                <li>
                    <a href="">
                        帮助与反馈
                    </a>
                </li>
                <li>
                    <a href="">
                        公共平台
                    </a>
                </li>
                <li>
                    <a href="">
                        开放平台
                    </a>
                </li>
                <li>
                    <a href="">
                        微信支付
                    </a>
                </li>
                <li>
                    <a href="">
                        微信广告
                    </a>
                </li>
                <li>
                    <a href="">
                        企业微信
                    </a>
                </li>
                <li>
                    <a href="">
                        表情开放平台
                    </a>
                </li>
                <li>
                    <a href="">
                        微信网页版
                    </a>
                </li>
            </ul>
        </div>
        <div class="a2">
            <img class="img" src="imges\left.png" alt="">
            <div class="a3" >
                <h3>微信，是一个生活方式</h1>
                <p>超过十亿人使用的手机应用</p>
                <p class="p1">支持发送语音短信、视频、图片和文字</p>
                <p>可以群聊，仅耗少量流量，适合大部分智能手机</p> 
                <a href="">
                    <img src="imges/1.png" alt="">
                </a>
                <ul>
                    <li>
                        <a href="">
                            忘记了微信帐号或密码？
                        </a>
                    </li>
                    <li class="a4">
                        <a href="">
                            自助解除登录或功能限制
                        </a>
                    </li>
                    <li>
                        <a href="">
                            冻结或解冻微信帐号
                        </a>
                    </li>
                </ul>
                </div>
        </div>
    </div>
    <div class="B">
        <div class="b1">
            <img src="imges/com.png" alt="">
            <div class="ba">
                <h5>微信网页版</h5>
                <p>扫一扫二维码</p>
                <p>就能在浏览器上使用微信</p>
                <ul>
                    <li>
                        <a href="">
                            了解更多
                        </a>
                    </li>
                </ul>
            </div>
            <div class="bb">
                <h5>微信 Mac 版</h5>
                <p>极致简洁，迅捷沟通</p>
                <ul>
                    <li>
                        <a href="">
                            了解更多
                        </a>
                    </li>
                </ul>
            </div>
            <div class="bc">
                <h5>微信 Windows 版</h5>
                <p>让沟通更方便</p>
                <ul>
                    <li>
                        <a href="">
                            了解更多
                        </a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="b2">
            <h5>最新信息</h5>
            <ul>
                <li>
                    <a href="">
                        微信 3.2.1 for Windows 正式版发布
                    </a>
                </li>
                <li>
                    <a href="">
                        微信 8.0.1 for Android 正式版发布
                    </a>
                </li>
                <li>
                    <a href="">
                        微信 8.0.2 for iOS 正式版发布
                    </a>
                </li>
                <li>
                    <a href="">
                        微信 2.6.1 for Mac 正式版发布
                    </a>
                </li>
                <li>
                    <a href="">
                        关于部分 iOS 9 用户无法更新微信
                    </a>
                </li>
                <li>
                    <a href="">
                        微信外部链接内容管理规范
                    </a>
                </li>
                <li>
                    <a href="">
                        微信网页版 2.1 版本发布
                    </a>
                </li>
                <li>
                    <a href="">
                        微信表情开放平台上线
                    </a>
                </li>
                <li>
                    <a href="">
                        官方辟谣公众号开通
                    </a>
                </li>
                <li class="li1">
                    <a href="">
                        查看更多
                    </a>
                </li>
            </ul>
            <img src="imges/tom.png" alt="">
            <h5>
                联系我们
            </h5>
        </div>
    </div>
    <div class="C">
        <ul>
            <li>
                <a href="" class="p5">
                    关于腾讯
                </a>
            </li>
        </ul>
        <p class="p3">|</p>
        <ul>
            <li>
                <a href="" class="p5">
                    服务条款
                </a>
            </li>
        </ul>
        <p class="p3">|</p>
        <ul>
            <li>
                <a href="" class="p5">
                    使用规范
                </a>
            </li>
        </ul>
        <p class="p3"> |</p>
        <ul>
            <li>
                <a href="" class="p5">
                    客服中心
                </a>
            </li>
        </ul>
        <p class="p3">|</p>
        <ul>
            <li>
                <a href="" class="p5">
                    隐私保护指引
                </a>
            </li>
        </ul>
        <ul>
            <li>
                <a href="" class="p4">
                    简体中文
                </a>
            </li>
            <p class="p6">|</p>
            <li>
                <a href="" class="p4">
                    繁體中文
                </a>
            </li>
            <p class="p6">|</p>
            <li  >
                <a href="" class="p4">
                    English

                </a>
            </li>
        </ul>
        <p class="p2">© 1998 - 2021 Tencent Inc. All Rights Reserved</p>
 
    </div>

</body>
</html>